{include file='common/header'}

<div class="content">

    <div class="panel">
        <div class="chat">
            <div class="left_bar">
                <div class="head-info">
                    {if condition="{:isset(session('user_info')['face'])}
                    <img src="{:session('user_info')['face']}" id="user_face" onclick="$('input[name=head_pic]').click()"/>
                    {else /}
                    <img src="__PUB__/img/default.png" id="user_face" onclick="$('input[name=head_pic]').click()"/>
                    {/if}
                    <input type="file" name="head_pic" class="hide"
                           onchange="updateHeadPic(this, '{:session(\'user_info\')[\'username\']}',
                            '{:url(\'Ajax/uploadFace\')}')" />
                    <div class="username">{:session('user_info')['nickname']}</div>
                </div>
                <ul class="chat_items">
                    <li title="好友" class="friend">
                        <div class="prompt hide"></div>
                        <span class="fa fa-comment action"></span>
                    </li>
                    <li title="群组" class="group">
                        <div class="prompt hide"></div>
                        <span class="fa fa-comments"></span>
                    </li>
                    <!--<li title="聊天室" class="room">
                        <div class="prompt hide"></div>
                        <span class="fa fa-commenting"></span>
                    </li>-->
                </ul>
                <div class="set">
                    <span class="fa fa-cog" id="toggle_set_menu"></span>
                    <ul class="cog_menu">
                        <li action="modify_name" def="{:session('user_info')['nickname']}">
                            <span class="fa fa-edit"></span>修改用户名</li>
                        {if condition="session('user_info')['type'] != 1"}
                        <li action="add_group"><span class="fa fa-plus"></span>创建群组</li>
                        {/if}
                        {if condition="session('user_info')['type'] != 1"}
                        <li action="add_room"><span class="fa fa-plus"></span>创建聊天室</li>
                        {/if}
                        <li action="exit"><span class="fa fa-power-off"></span>退出({:session('user_info')['username']})</li>
                    </ul>
                </div>
            </div>
            <div class="chat_dom">
                <div class="search_dom"><input id="search_bar" type="text" /></div>
                <div class="chat_list"></div>
            </div>
            <div class="chat_panel">
                <div class="chat_shade">
                    <h2><span class="fa fa-2x fa-minus-circle"></span></h2>
                    <p class="notice">请选择聊天对象</p>
                </div>
                <div class="chat_content">
                    <div class="top_bar">
                        <div class="obj_info">
                            <div class="obj_name">对象名称</div>
                            <span class="fa fa-sort-down show_list"></span>
                            <ul class="obj_list hide"></ul>
                        </div>
                        <div class="top_conf">
                            <span class="fa fa-cog"></span>
                            <ul class="top_conf_menu"></ul>
                        </div>
                    </div>
                </div>
                <div class="chat_area">
                    <ul class="tool_bar">
                        <li>
                            <span class="fa fa-smile-o" onclick="openFacePanel(1)"></span>
                            <ul class="face_chose hide"></ul>
                        </li>
                        <li>
                            <span class="fa fa-heart-o" onclick="openFacePanel(2)"></span>
                            <ul class="face_chose_big hide"></ul>
                        </li>
                        <li>
                            <span onclick="$('#send_image').click();" class="fa fa-image"></span>
                            <input type="file" onchange="Im.sendPicture();" id="send_image" />
                        </li>
                    </ul>
                    <textarea id="reply"></textarea>
                    <button onclick="Im.sendMessage()">发送</button>
                </div>
            </div>
        </div>
    </div>

</div>

{include file='common/footer'}

<script src="__JS__/webim.config.js"></script>
<script src="__JS__/strophe-1.2.8.min.js"></script>
<script src="__JS__/websdk-1.4.5.min.js"></script>
<script src="__JS__/im.js"></script>